<template>
  <div>
    <ProfileListItem class="list-item topspecial">
      <img src="@/assets/img/profile/message.svg" slot="image"/>
      <span slot="desc">我的消息</span>
    </ProfileListItem>
       <ProfileListItem class="list-item">
      <img src="../../../assets/img/profile/pointer.svg" slot="image"/>
      <span slot="desc">积分商城</span>
    </ProfileListItem>
       <ProfileListItem class="list-item special">
      <img src="../../../assets/img/profile/vip.svg" slot="image"/>
      <span slot="desc">会员卡</span>
    </ProfileListItem>
       <ProfileListItem class="list-item">
      <img src="../../../assets/img/profile/cart.svg" slot="image"/>
      <span slot="desc">购物车</span>
    </ProfileListItem>
       <ProfileListItem class="list-item">
      <img src="../../../assets/img/profile/load.svg" slot="image"/>
      <span slot="desc">下载app</span>
    </ProfileListItem>
  </div>
</template>
<script>
import ProfileListItem from './ProfileListItem'
export default {
  name:'ProfileList',
  components:{
    ProfileListItem,
  }
}
</script>
<style scoped>
.list-item{
  display: flex;
  padding: 5px 10px;
  border-bottom: 1px solid rgba(0, 0, 0, .3);
  font-size: 15px;
}
.special{
  border-bottom: 10px solid #ddd;
}
.topspecial{
  border-top: 10px solid #ddd;
}
img{
  width: 25px;
  height: 25px;
  vertical-align:middle;
}
</style>